<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <script src="snap.svg.js"></script>
    <script src="diagram.js"></script>
</head>
<body>
<style>
    #svg {
        border : 1px solid #000000;
    }
</style>
<svg id="svg"></svg>
<script>

    var data = {

        "cellPadding" : 15,
        "tableMargin" : 10,

        "nodes": [
            {
                "type": "start",
                "cell" : "0,0"
            },
            {
                "type" : "task",
                "cell" : "1,0",
                "id" : "import",
                "name" : "上传数据包",
                "highlight": true,
                "clickFun": cf,
                "url": "/mark/data/prepare",
                "data": ["step1"]
            },
            {
                "type" : "task",
                "cell" : "1,1",
                "id" : "subtable",
                "name" : "初始化字表",
                "clickFun": cf,
                "url": "/mark/data/prepare",
                "data": ["step2"]
            },
            {
                "type" : "task",
                "cell" : "1,2",
                "id" : "convert",
                "name" : "成绩转换",
                "clickFun": cf,
                "url": "/mark/data/prepare",
                "data": ["step3"]
            },
            {
                "type" : "decision",
                "id" : "reImport",
                "name" : "重新上传",
                "cell" : "2,2",
                "w" : 120
            },
            {
                "type" : "task",
                "cell" : "3,2",
                "id" : "sample",
                "name" : "数据抽样",
                "clickFun": cf,
                "url": "/mark/data/sample",
                "data": ["step4"]
            },
            {
                "type" : "task",
                "cell" : "4,1",
                "id" : "answerImport",
                "name" : "上传标答",
                "highlight": true,
                "clickFun": cf,
                "url": "/mark/data/answer",
                "data": ["数据抽样", "step5"]
            },
            {
                "type" : "task",
                "cell" : "4,2",
                "id" : "answer",
                "name" : "模型设置",
                "clickFun": cf,
                "url": "/mark/data/answer",
                "data": ["step5"]
            },
            {
                "type" : "task",
                "cell" : "4,3",
                "id" : "preDeal",
                "name" : "数据预处理",
                "clickFun": cf,
                "url": "/mark/data/answer",
                "data": ["step6"]
            },
            {
                "type" : "task",
                "cell" : "4,4",
                "id" : "train",
                "name" : "模型训练",
                "clickFun": cf,
                "url": "/mark/data/answer",
                "data": ["step7"]
            },
            {
                "type" : "task",
                "cell" : "4,5",
                "id" : "predict",
                "name" : "模型预测",
                "clickFun": cf,
                "url": "/mark/data/answer",
                "data": ["step8"]
            },
            {
                "type" : "task",
                "cell" : "5,5",
                "id" : "result",
                "name" : "评分统计",
                "clickFun": cf,
                "url": "/mark/result",
                "data": ["step9"]
            },
            {
                "type" : "task",
                "cell" : "6,5",
                "id" : "export",
                "name" : "评分导出",
                "clickFun": cf,
                "url": "/mark/export",
                "data": ["step10"]
            },
            {
                "type": "end",
                "cell" : "7,5"
            },
        ],
        "lines": [
            {
                "from": "start",
                "to": "import"
            },
            {
                "from": "import",
                "to": "subtable",
            },
            {
                "from": "subtable",
                "to": "convert",
            },
            {
                "from": "convert",
                "to": "reImport",
            },
            {
                "from": "reImport",
                "to": "import",
                "direction" : "x",
                "text" : "是"
            },
            {
                "from": "reImport",
                "to": "sample",
                "text" : "否"
            },
            {
                "from": "sample",
                "to": "answer"
            },
            {
                "from": "answerImport",
                "to": "answer"
            },
            {
                "from": "answer",
                "to": "preDeal"
            },
            {
                "from": "preDeal",
                "to": "train",
            },
            {
                "from": "train",
                "to": "predict",
            },
            {
                "from": "predict",
                "to": "result"
            },
            {
                "from": "result",
                "to": "export"
            },
            {
                "from": "export",
                "to": "end"
            },
        ]
    };

    function cf(url, data){
        alert(url);
        console.log(data)
    }

    var flow = new Flow("svg", data);
    flow.renderByTableLayout();


</script>
</body>
</html>